<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>pay</title>
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <script src="../js/angular-1.4.6.min.js"></script>
    <script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
    <style>
        .address{}
        .addr-title{overflow: hidden;font-size: 16px;font-weight: bold;padding: 15px 0;}
        .addr-title .fl{line-height: 35px;}
        .addr-title .fr{width: 145px;height: 35px;line-height: 35px;border: 1px solid #d7d7d7;text-align: center;}
        .addr-con{}
        .addr-con span{display: inline-block;margin-right: 20px;font-size: 14px;color: #726b66;line-height: 26px;}

        .more-addr{margin-top: 20px;margin-bottom: 10px;}
        .more-addr li{margin-top: 10px;}
        .more-addr ul{display: none;}
        .m-a-title{cursor: pointer;}

        .payment{text-align: center;border-top: 1px solid #d7d7d7;padding: 20px 0;}
        .t-title{text-align: left;}

        .shipment{text-align: center;border-top: 1px solid #d7d7d7;padding: 20px 0;}
        .shipment b{font-size: 24px;display: block;}
        .shipment label{display: inline-block;padding: 20px 50px;}
        .shipment label img{display: block;height: 100px;}
        .shipment label input{margin-top: 10px;}


        .goods-list{font-size: 14px;border-bottom: 1px solid #d7d7d7;border-top: 1px solid #d7d7d7;padding-top: 20px;;padding-bottom: 20px;}
        .goods-title{font-size: 16px;font-weight: bold;margin-bottom: 10px;}
        .list-title{}
        .list-title span{margin-right: 50px;color: #999;line-height: 24px;font-size: 13px;}
        .goods-list ul li table{width: 100%;margin-bottom: 15px;}
        .goods-list ul li table th{background-color: #f8f8f8;height: 35px;text-align: center;}
        .goods-list ul li table td{text-align: center;padding: 10px 0;}
        .goods-list ul li table .t-title{}
        .goods-list ul li table .t-title .fl{float: left;display: table;}
        .goods-list ul li table .t-title .fl a{width: 120px;height: 120px;display: table-cell;vertical-align: middle;}
        .goods-list ul li table .t-title .fl img{max-width: 120px;max-height: 120px;}
        .goods-list ul li table .t-title .word-box a{width: 250px;height: 120px;}
        .goods-list ul li table .t-title .word-box p{text-align: left;padding-left: 20px;}

        .add-note{}
        .add-note p{line-height: 30px;font-weight: bold;text-align: center;font-size: 16px;margin-top: 10px;}
        .add-note textarea{border: 1px solid #d7d7d7;outline: none;display: block;width: 100%;resize: none;}
        .total-con{text-align: right;font-size: 16px;font-weight: bold;line-height: 30px;padding: 10px 0;}
        .total-con .amount{font-size: 18px;margin-top: 10px;}
        .pay-btn{width: 340px;height: 80px;line-height: 80px;font-size: 20px;display: inline-block;margin: 20px 0;}

        .bottom-list{margin-top: 30px;}
        .bottom-list div{background-color: #f8f8f8;font-size: 14px;line-height: 45px;margin-bottom: 10px;text-align: right;color: #726b66;}
    </style>
</head>
<body ng-app="">
<!--公共头部-->
<div ng-include="'../html/header.html'"></div>
<div class="bread container-fluid">
    <div class="container clear">
        <div class="fl path">
            <p class="fs-18"><em>You are here:&nbsp;</em><span class="bold red text-capitalize">shopping cart</span></p>
        </div>
        <div class="fr">
            <div class="btn b-red white fs-14 bold">JUMP TO<img src="../img/vimostsports（About-Us-）_03.jpg" alt=""/></div>
            <ul class="list fs-14 text-capitalize">
                <li>
                    <a href="">about us</a>
                </li>
                <li>
                    <a href="">gallery</a>
                </li>
                <li>
                    <a href="">sublimation</a>
                </li>
                <li>
                    <a href="">how to order</a>
                </li>
                <li>
                    <a href="">order process</a>
                </li>
                <li>
                    <a href="">fabric guide</a>
                </li>
                <li>
                    <a href="">blog</a>
                </li>
                <li>
                    <a href="">FAQS</a>
                </li>
                <li>
                    <a href="">customer reviews</a>
                </li>
                <li>
                    <a href="">contact us</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="content container">
    <div class="address">
        <div class="addr-title">
            <div class="fl">DELIVERY ADDRESS</div>
            <div class="fr">ADD ADDRESS</div>
        </div>
        <div class="addr-con">
            <span>Ship to/Consignee:jamie harries</span>
            <span>Address:15 pelham road</span>
            <span>Town/Area code:Droitwich,Worcestershire WR9 8NT</span>
            <span>Country:England</span>
            <span>Contact name:jamie harris</span>
            <span>Tel/Fax no:8567574556</span>
        </div>
        <div class="more-addr">
            <p class="m-a-title fs-14">MORE ADDRESS <img src="../img/vimostsports（jiesuan-wuliu_03.png" alt=""/></p>
            <ul>
                <li>
                    <div class="addr-con">
                        <span>Ship to/Consignee:jamie harries</span>
                        <span>Address:15 pelham road</span>
                        <span>Town/Area code:Droitwich,Worcestershire WR9 8NT</span>
                        <span>Country:England</span>
                        <span>Contact name:jamie harris</span>
                        <span>Tel/Fax no:8567574556</span>
                    </div>
                </li>
                <li>
                    <div class="addr-con">
                        <span>Ship to/Consignee:jamie harries</span>
                        <span>Address:15 pelham road</span>
                        <span>Town/Area code:Droitwich,Worcestershire WR9 8NT</span>
                        <span>Country:England</span>
                        <span>Contact name:jamie harris</span>
                        <span>Tel/Fax no:8567574556</span>
                    </div>
                </li>
                <li>
                    <div class="addr-con">
                        <span>Ship to/Consignee:jamie harries</span>
                        <span>Address:15 pelham road</span>
                        <span>Town/Area code:Droitwich,Worcestershire WR9 8NT</span>
                        <span>Country:England</span>
                        <span>Contact name:jamie harris</span>
                        <span>Tel/Fax no:8567574556</span>
                    </div>
                </li>
                <li>
                    <div class="addr-con">
                        <span>Ship to/Consignee:jamie harries</span>
                        <span>Address:15 pelham road</span>
                        <span>Town/Area code:Droitwich,Worcestershire WR9 8NT</span>
                        <span>Country:England</span>
                        <span>Contact name:jamie harris</span>
                        <span>Tel/Fax no:8567574556</span>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="payment">
        <p class="t-title bold text-uppercase fs-16">payment</p>
        <label>
            <img src="../img/vimostsports（jiesuan-wuliu_07.png" alt=""/>
            <br/>
            <input type="checkbox"/>
        </label>
    </div>
    <div class="shipment">
        <p class="t-title bold text-uppercase fs-16">shipment</p>
        <b class="red text-uppercase">free shipping on orders over $350</b>
        <label>
            <img src="../img/vimostsports（jiesuan-wuliu_11.png" alt=""/>
            <br/>
            <input type="radio" name="shipment"/>
            <br/>
            <span></span>
        </label>
        <label>
            <img src="../img/vimostsports（jiesuan-wuliu_14.png" alt=""/>
            <br/>
            <input type="radio" name="shipment"/>
        </label>
        <label>
            <img src="../img/vimostsports（jiesuan-wuliu_17.png" alt=""/>
            <br/>
            <input type="radio" name="shipment"/>
        </label>
    </div>
    <div class="goods-list">
        <p class="goods-title">ORDER INFORMATION</p>
        <ul>
            <li>
                <p class="list-title">
                    <span>Order No:24235465476754</span>
                    <span>2016-02-12 12:13:14</span>
                </p>
                <table border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <th style="width: 400px;">Title</th>
                        <th style="width: 150px;">Price(US$)</th>
                        <th style="width: 150px;">Size</th>
                        <th style="width: 150px;">Qty</th>
                        <th style="width: 200px;">Colour</th>
                        <th style="width: 150px;">Total(US$)</th>
                    </tr>
                    <tr>
                        <td class="t-title">
                            <div class="fl img-box">
                                <a href="javascript:void(0);">
                                    <img src="../img/vimostsports（Gallery）_06.jpg" alt=""/>

                                </a>
                            </div>
                            <div class="fl word-box">
                                <a href="javascript:void(0);">
                                    <p class="text-uppercase">baseball hoodies(jh009)</p>
                                    <p class="text-capitalize">add name</p>
                                    <p class="text-capitalize">add number</p>
                                </a>
                            </div>
                        </td>
                        <td class="t-price">
                            <p>$17.80</p>
                            <p>$2 each</p>
                            <p>$2 each</p>
                        </td>
                        <td class="t-size">L</td>
                        <td class="t-qty">1</td>
                        <td class="color text-capitalize">heather grey/jet black</td>
                        <td class="t-total">$21.8</td>
                    </tr>
                </table>
            </li>
        </ul>
    </div>
    <div class="add-note">
        <p>ADD NOTE</p>
        <textarea rows="5"></textarea>
    </div>
    <div class="total-con">
        <p class="freight">Freight: <span class="red">$0</span></p>
        <p class="amount">Total Amount: <span class="red">$870.00</span></p>
        <a href="" class="pay-btn b-red white text-center">PLACE ORDER</a>
    </div>
    <div class="bottom-list">
        <div><span>MAILING ADDRESS:</span>sichuan/chengdu/xipu town <span>Consignee:</span>ming-yang lee 189****1234</div>
    </div>
</div>
<!--公共底部-->
<div ng-include="'../html/footer.html'"></div>
</body>
<script>
    $(function(){
        $('.m-a-title').click(function(){
            if($(this).hasClass('open')){
                $(this).removeClass('open');
                $('.more-addr ul').slideUp();
            }else{
                $(this).addClass('open');
                $('.more-addr ul').slideDown();
            }
        })
    })
</script>
<script src="../js/scroll_top.js"></script>
</html>